<!DOCTYPE html>
<html class="x-admin-sm">
<head>
<meta charset="UTF-8">
<title>列表</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="/css/font.css">
<link rel="stylesheet" href="/css/index.css">
<script type="text/javascript" src="/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/js/index.js"></script>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/layui-post.js"></script>
</head>
<body>
<div class="x-nav">
	<span class="layui-breadcrumb"><a href="">商品管理</a><a><cite>商品列表</cite></a></span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新"><i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5">
		                <div class="layui-inline layui-show-xs-block">
		                    <input type="text" id="goodsName" autocomplete="off" value="" placeholder="请输入商品名称" class="layui-input">
		                </div>
		                <div class="layui-inline layui-show-xs-block">
                            <select name="productType" id="productType" lay-search lay-verify="required"><option value="">请选择产品类型</option></select>
		                </div>
		                <div class="layui-inline layui-show-xs-block">
                            <select name="freeType" id="freeType" lay-search lay-verify="required"><option value="">请选择优惠类型</option></select>
		                </div>
                        <div class="layui-inline layui-show-xs-block">
                            <select name="deliveryType" id="deliveryType" lay-search lay-verify="required"><option value="">请选择配送方式</option></select>
                        </div>
		                <div class="layui-inline layui-show-xs-block">
                            <select name="goodsType" id="goodsType" lay-search lay-verify="required"><option value="">请选择配送方式</option></select>
		                </div>
                        <div class="layui-inline layui-show-xs-block">
                            <select id="status">
                            	<option value="">请选择商品状态</option>
                                <option value="0">上架</option>
                                <option value="1">下架</option>
                            </select>
                        </div>
		                <div class="layui-inline layui-show-xs-block">
		                    <input type="text" id="remark" autocomplete="off" value="" placeholder="请输入备注说明" class="layui-input">
		                </div>
                        <div class="layui-inline layui-show-xs-block">
                            <button class="layui-btn"  lay-submit="" lay-filter="sreach" id="search"><i class="layui-icon">&#xe615;</i></button>
                        </div>
                    </form>
                </div>
                <div class="layui-card-header">
                    <button class="layui-btn" onclick="xadmin.open('新增','./cateringgoodsadd')"><i class="layui-icon layui-icon-add-circle"></i>添加</button>
                	<!--<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>-->
                </div>
                <div class="layui-card-body layui-table-body layui-table-main">
                    <table class="layui-table layui-form" id="table" lay-filter="table"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 物流跟踪 -->
<div class="modal-dialog" id="orderLog" style="font-size:16px;display: none;background: #fff;padding: 30px;">
    <ul class="layui-timeline" id="orderwl"></ul>
</div>
</body>
<script>
$.ajaxSetup({contentType: "application/json; charset=utf-8"});
let checkArr = null;
layui.use(['table','form'], function(){
	var table = layui.table
    $.post(geturl()+'/enums/select?token='+sessionStorage.getItem("token"), JSON.stringify({parentEnumCode:"PRODUCT_TYPE<->FREE_TYPE<->DELIVERY_TYPE<->GOODS_TYPE",orderByAscType:"enumCode"}), function (res) {
        for(var key in res.data.PRODUCT_TYPE) $('#productType').append('<option value="'+key + '">' + res.data.PRODUCT_TYPE[key] + '</option>');
        for(var key in res.data.FREE_TYPE) $('#freeType').append('<option value="'+key + '">' + res.data.FREE_TYPE[key] + '</option>');
        for(var key in res.data.GOODS_TYPE) $('#goodsType').append('<option value="'+key + '">' + res.data.GOODS_TYPE[key] + '</option>');
        for(var key in res.data.DELIVERY_TYPE) $('#deliveryType').append('<option value="'+key + '">' + res.data.DELIVERY_TYPE[key] + '</option>');
        layui.form.render();
    }).done(function(res){
        function enums(s,enumCode){
            for(var key in res.data[enumCode]) if(!isEmpty(s)) {if(key === s) return res.data[enumCode][s];} else return "";
        }
        table.render({
            elem: 'table', //指定元素
            url:geturl()+'/cateringGoods/select?token='+sessionStorage.getItem("token"),
            contentType:'application/json',
            method:'post',
            page:true,
            cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            where:{orderByAscType: "status"},
            cols: [[
                //{type: 'checkbox',width: 80},
                {title: '序号',align:"center",halign:"center",width:80,type: 'numbers'},
                {field:'status',align:"center",title:'是否下架',templet:onloadStatus},
                {field:'goodsNo',align:"center",title:'商品编号',width:120},
                {field:'goodsName',align:"center",title:'商品名称',width:180},
                {field:'productType',align:"center",title:'产品类型',templet:function(d){ return enums(d.productType,"PRODUCT_TYPE");}},
                {field:'freeType',align:"center",title:'优惠类型',templet:function(d){ return enums(d.freeType,"FREE_TYPE");}},
                {field:'goodsImg',align:"center",title:'商品海报',templet:function(d){return '<span style="cursor: pointer;color: blue;text-decoration:underline;" onclick="showpic(\''+d.goodsImg+'\',40,80)">查看</span>'}},
                {field:'goodsStock',align:"center",title:'商品库存'},
                {field:'goodsPrice',align:"center",title:'商品价格'},
                {field:'spacesId',align:"center",title:'商品规格',templet:function(d){ return d.isSpaces == 1?'<span style="cursor: pointer;color: #ff004d;text-decoration:underline;" onclick="showSpaces(\''+d.sysId+'\',\''+d.goodsName+'\')">查看</span>': "无";}},
                {field:'goodsType',align:"center",title:'商品类型',templet:function(d){ return enums(d.goodsType,"GOODS_TYPE");}},
                {field:'discount',align:"center",title:'商品折扣',templet:function (d){return d.discount + "折";}},
                {field:'isTop',align:"center",title:'是否置顶',templet:onloadTop},
                {field:'deliveryType',align:"center",title:'配送方式',templet:function(d){ return enums(d.deliveryType,"DELIVERY_TYPE");}},
                {field:'isChange',align:"center",title:'开启兑换',templet:function (d){return d.isChange===0?"否":"是";}},
                {field:'isInter',align:"center",title:'参与积分',templet:function (d){return d.isInter===0?"否":"是";}},
                {field:'interNum',align:"center",title:'积分数量',},
                {field:'saleNum',align:"center",title:'销量',},
                {field:'remark',align:"center",title:'备注说明',},
                {field:'createTime',align:"center",title: '创建时间',},
                {fixed:'right',align: 'center',title:'操作',width: 80,templet: onloadTool }
            ]],
        });
    })
	layui.table.on('checkbox(table)', function(obj){
		checkArr = null;
	    let checkStatus = table.checkStatus('table'),data = checkStatus.data; //获取选中的数据
	    for (let i = 0; i < data.length; i++) {
	    	checkArr = checkArr != null ? checkArr + "," + data[i].sysId:data[i].sysId;
	    }
	    console.log(checkArr)
	});
    layui.form.on('switch(switchTest)', function(data){
        var id = data.elem.attributes['data_id'].nodeValue;
        var status = data.elem.attributes['status'].nodeValue;
        var em = $(data.othis[0]);
        layer.confirm('确认'+(status == 0 ? '' : '取消')+'下架吗？',{icon: 0,title:'提示',cancel:function(){closeSwitch1(data,status,em);}},function(index){
            if(status == 0) layuiPost(geturl()+'/cateringGoods/update?token='+sessionStorage.getItem("token"),{status:1,sysId:id});
            else layuiPost(geturl()+'/cateringGoods/update?token='+sessionStorage.getItem("token"),{status:0,sysId:id});
        },function(index){
            closeSwitch1(data,status,em)
        });
    });
    layui.form.on('switch(switchTop)', function(data){
        var id = data.elem.attributes['data_id'].nodeValue;
        var status = data.elem.attributes['status'].nodeValue;
        var em = $(data.othis[0]);
        layer.confirm('确认'+(status == 0 ? '' : '取消')+'置顶？',{icon: 0,title:'提示',cancel:function(){closeSwitch1(data,status,em);}},function(index){
            if(status == 0) layuiPost(geturl()+'/cateringGoods/update?token='+sessionStorage.getItem("token"),{isTop:1,sysId:id});
            else layuiPost(geturl()+'/cateringGoods/update?token='+sessionStorage.getItem("token"),{isTop:0,sysId:id});
        },function(index){
            closeSwitch1(data,status,em)
        });
    });
});
function onloadStatus(data){
    if(data.status == 1){
        return '<input type="checkbox" checked="" name="switch" lay-skin="switch" data_id="'+data.sysId+'" status="'+data.status+'" lay-filter="switchTest" lay-text="是|否">'
    }else if(data.status == 0){
        return '<input type="checkbox" name="switch" lay-skin="switch" data_id="'+data.sysId+'" status="'+data.status+'" lay-filter="switchTest" lay-text="是|否">'
    }
}
function onloadTop(data){
    if(data.isTop == 1){
        return '<input type="checkbox" checked="" name="switch" lay-skin="switch" data_id="'+data.sysId+'" status="'+data.isTop+'" lay-filter="switchTop" lay-text="是|否">'
    }else if(data.isTop == 0){
        return '<input type="checkbox" name="switch" lay-skin="switch" data_id="'+data.sysId+'" status="'+data.isTop+'" lay-filter="switchTop" lay-text="是|否">'
    }
}
/*删除*/
function member_del(obj,id){
    layer.confirm('确认要删除吗？',function(index){
    	layuiPost(geturl()+'/cateringGoods/delete?token='+sessionStorage.getItem("token"),{sysId:id});
    });
}

$('#search').on('click', function() {
	layui.table.reload('table', {
		page: {curr: 1},
		where : {
			goodsName:$("#goodsName").val(),
            productType:$("#productType").val(),
            freeType:$("#freeType").val(),
            goodsType:$("#goodsType").val(),
            deliveryType:$("#deliveryType").val(),
			status:$("#status").val(),
			remark:$("#remark").val(),
		},
	});
	return false;
});

function showSpaces(sysId,name){
    $("#orderwl").html("")
    $.post(geturl()+"/spacesChild/select",JSON.stringify({goodsId:sysId}),function(res){
        for(var i in res.data){
            $("#orderwl").append(
                '<li class="layui-timeline-item">' +
                '<i class="layui-icon layui-timeline-axis">&#xe617;</i>' +
                '<div class="layui-timeline-content layui-text">' +
                '<h3 class="layui-timeline-title" style="font-size:18px;font-weight:bold;">'+res.data[i].spacesName+'</h3>' +
                '<p></p>' +
                '</div>' +
                '</li>'
            )
            for(var k in res.data[i].childList){
                $("#orderwl").append(
                    '<li class="layui-timeline-item">' +
                    '<i class="layui-icon layui-timeline-axis" style="color:#000000d9;">&#xe617;</i>' +
                    '<div class="layui-timeline-content layui-text">' +
                    '<h3 class="layui-timeline-title" style="font-size:16px;text-align: center;">'+res.data[i].childList[k].spacesName+'</h3>' +
                    '<p></p>' +
                    '</div>' +
                    '</li>'
                )
            }
        }
    })
    layer.open({
        type:1,
        area: ['40%', '80%'],
        title:[name+"规格", 'text-align:center;font-size: 16px; font-weight: bold;padding-left: 80px;'],
        closeBtn:1,
        btnAlign: 'c',
        offset: 'auto',
        anim: 2,
        shadeClose:true,
        content:$("#orderLog"),
        scrollbar:false,
    })
}
function onloadTool(data) {
	let htmls = 
	  	'<a title="编辑" onclick="xadmin.open(\'编辑\',\'cateringgoodsedit?sysId='+data.sysId+'\')" href="javascript:;"><i class="layui-icon">&#xe642;</i></a>'+
	  	'<a title="删除" onclick="member_del(this,\''+data.sysId+'\')" href="javascript:;"><i class="layui-icon">&#xe640;</i></a>'
   	return htmls;
}
</script>
</html>